<!DOCTYPE html>
<html>
<script type="text/javascript" async="" src="order_files/mv.js"></script>
<!-- <script type="text/javascript" async="" src="order_files/fm.js"></script> -->
<script src="order_files/push.js"></script>
<script type="text/javascript" async="" src="order_files/bdctrace-pc.js"></script>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <!-- <script id="_1614514971187_2626" src="order_files/detect.json"></script> -->
    <meta charset="utf-8">
    <title>填写订单</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="renderer" content="webkit">
    <link rel="stylesheet" href="order_files/index_003.css">
    <script async="" src="order_files/sensorsdata.js" charset="UTF-8"></script>
    <script src="order_files/eluminate.js"></script>
    <script src="order_files/coremetrics-initalize.js"></script>
    <script language="javascript" type="text/javascript" src="order_files/52710000.js"></script>
    <script type="text/javascript">cmSetupOther({ "cm_FormPageID": true });</script>
    <script type="text/javascript" src="order_files/frms-fingerprint.js"></script>
    <!--神策引用-->
    <script src="order_files/getSensorsJs.js"></script>
    <script src="order_files/sensors-losc.js"></script>
    <link rel="stylesheet" href="order_files/jquery.css">
    <script id="WdatePickerjs" src="order_files/WdatePicker.js"></script>
    <link href="order_files/WdatePicker.css" rel="stylesheet" type="text/css">


    <script type="text/javascript" src="./js/vue/vue.js"></script>
    <script type="text/javascript" src="./js/jquery.js"></script>
    <script type="text/javascript" src="./js/script.js"></script>
    <!-- <script type="text/javascript" src="./js/list.js"></script> -->
    <script type="text/javascript" src="./js/axios.min.js"></script>

    <script type="text/javascript" src="./js/address.js"></script>
    <script type="text/javascript" src="./js/common.js"></script>


    <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
    <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="jqueryui/style.css">
    <script>
    $(function() {
      $( "#datepicker" ).datepicker();
    });
    </script>
</head>

<body class="order order_ticket">

    <div class="order-header wrap">
        <div class="header-inner">
            <span class="logo">自助天下游 就找驴妈妈</span>
            <p class="welcome" name="topWelcome">
            </p>
            <p class="info">24小时服务热线：<strong>1010-6060</strong></p>
        </div>
    </div>

    <div class="mainBox" id="app">
        <div class="wrap">
           
            <!-- 操作步骤 -->
            <ol class="ui-step ui-step-3">
                <li class="ui-step1 ui-step-start ui-step-active">
                    <div class="ui-step-arrow">
                        <i class="arrow_r1"></i> <i class="arrow_r2"></i>
                    </div> <span class="ui-step-text">填写订单</span>
                </li>
                <li class="ui-step2 ">
                    <div class="ui-step-arrow">
                        <i class="arrow_r1"></i> <i class="arrow_r2"></i>
                    </div> <span class="ui-step-text">在线支付</span>
                </li>
                <li class="ui-step3 ui-step-end ">
                    <div class="ui-step-arrow">
                        <i class="arrow_r1"></i> <i class="arrow_r2"></i>
                    </div> <span class="ui-step-text">预订成功</span>
                </li>
            </ol>

            <div class="orderTicket clearfix">
                <!--订单明细-->
                <div class="orderInfo orderTicketInfo">
                    <div class="orderTicketInfo-list">
                        <h3>费用明细</h3>
                        <ul class="nobd">
                            <li class="primary"><em>门票价格</em><dfn><i>￥</i>{{ticket.price}}</dfn></li>

                            <li><em>{{ticket.name}}</em><dfn class="dark"><span class="f12">{{order.ticketNum=order.kidNum+order.adultNum}} X <i>￥</i></span>{{ticket.price}}</dfn>
                            </li>
                        </ul>
                        <ul class="last"></ul>
                    </div>
                    <div class="ticketPriceTotal">
                        <em>应付金额</em>
                        <div class="priceCount">
                            <dfn><span class="yh">￥</span>{{order.kidNum*ticket.price/2+order.adultNum*ticket.price}}</dfn>
                        </div>
                    </div>
                </div><!-- //orderInfo -->
                <div class="orderMainLeft">
                    <div class="orderMain">
                        <form>
                            
                            <div class="orderBox">
                                <div class="orderTit">
                                    <span class="iconBg"><b class="orderIcon orderIcon-viewpoint"></b></span>
                                    <h3>{{ticket.name}}</h3>
                                    <span class="orderTit-subTit">在线支付</span>
                                </div>

                                <div class="ticketLi last main">
                                    <div class="ticketTit">
                                        
                                        <a href="javascript:;" class="ticketTit-link">{{ticket.name}}
                                        </a>
                                    </div>
                                    

                                    <dl class="orderDl">
                                        <dt>日  期：</dt>
                                        <dd>
                                            <div class="ticket-dataSelect" >
                                                <input class="input js_yz J_calendar yz_error" v-model="order.time"  type="text" id="datepicker">
                                            </div>
                                        </dd>
                                    </dl>
                                    <dl class="orderDl">
                                        <dt>成人票：</dt>
                                        <dd class="orderNumBox clearfix">
                                            <a  :class="order.adultNum==0?'orderContro orderReduce num_stop':'orderContro orderReduce'"
                                            @click="order.adultNum=order.adultNum-1">-</a>

                                            <input type="text" class="ordeRoomNum js_input" v-model="order.adultNum">

                                            <a  class="orderContro orderAdd" @click="order.adultNum=order.adultNum+1">+</a>
                                        </dd>
                                    </dl>
                                    <dl class="orderDl">
                                        <dt>儿童票</dt>
                                        <dd class="orderNumBox clearfix">
                                            <a  :class="order.kidNum==0?'orderContro orderReduce num_stop':'orderContro orderReduce'"  
                                            @click="order.kidNum=order.kidNum-1">-</a>

                                            <input type="text" class="ordeRoomNum js_input" v-model="order.kidNum">

                                            <a href="javascript:;" class="orderContro orderAdd"  @click="order.kidNum=order.kidNum+1">+</a>
                                        </dd>
                                    </dl>
                                </div>

                            </div> 


                            <div class="orderBox order_box">
                                <div class="orderTit">
                                    <h3>用户信息 </h3>
                                </div>
                                <div id="userinfoDiv">
                                    <div class="ticketInput" id="Jtenantlist">
                                        
                                        <div class="ticketGroup">
                                            <h3 class="ticketInput-ticTit">{{ticket.name}}</h3>

                                            <div class="playerLi">
                                                <div class="user_info border_t1_dotted" index="0">
                                                    <p class="orderUser"><em>游玩人</em> <span class="tagPink JS_pinkTip"
                                                            tip-content="取票人同时接收确认短信">取票人</span>
                                                    </p>
                                                    <dl class="orderDl js_user_dl">
                                                        <dt><span class="red">*</span>中文姓名：</dt>
                                                        <dd>
                                                            <input class="input js_yz empty_check name" id="fullName0"
                                                                 type="text" maxlength="20"
                                                                placeholder="请输入姓名" 
                                                                v-model="order.contactName"
                                                                >
                                                        </dd>
                                                    </dl>

                                                    <input type="hidden" id="isFrozenFlag" value="N">
                                                    <dl class="orderDl js_user_dl">
                                                        <dt><span class="red">*</span>手机号码：</dt>
                                                        <dd>
                                                            <input class="input js_yz js_textBig" id="mobile0"
                                                                 type="text" placeholder="请输入手机号码"
                                                                 v-model="order.contactPhone"
                                                                >
                                                        </dd>
                                                    </dl>
                                                    <dl class="orderDl js_user_dl">
                                                        <dt><span class="red">*</span>证件类型：</dt>
                                                        <dd>
                                                            <div id="selectbox_1614514969923"
                                                                class="selectbox selectbox-idCard">
                                                                <p class="select-info like-input"><span
                                                                        class="select-arrow"><i
                                                                            class="ui-arrow-bottom dark-ui-arrow-bottom"></i></span><span
                                                                        class="select-value">身份证</span></p>
                                                                <div class="selectbox-drop">
                                                                    <ul class="select-results">
                                                                        <li rel="ID_CARD" class="liActive">身份证</li>
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                            <input class="input js_yz js_textBig" type_name="user_ID"
                                                                id="idNo0"  maxlength="25" v-model="order.contactIdCart"
                                                                type="text" placeholder="证件号码"
                                                                >
                                                        </dd>
                                                    </dl>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                        <div class="orderFoot">
                            <div class="payBox">
                                <a class="btn btn-xl js_tijiao btn-orange" @click="save()">
                                    立即付款
                                </a>
                            </div>
                        </div>
                    </div><!-- //orderMain -->
                </div>

            </div>
        </div><!-- //warp -->
    </div><!-- //mainBox -->
    <script>
       
        var vm = new Vue({
            el:"#app",
            data:{
                attractionsId:"",
                ticket:{},
                order:{
                    adultNum:1,
                    kidNum:1
                },//订单信息
            },
            methods: {
                search(){
                    wfx.http.get("/ticket1/findById?attractionsId="+this.attractionsId).then(res=>{
                        this.ticket=res
                        this.order.attractionsId=res.attractionsId
                    })
                },
                save(){
                    
                    wfx.http.post("/order1/addOrder",this.order).then(res=>{

                        if(res.success){
                            location.href="order_pay.html?id="+res.data
                        }else{
                            
                        }
                    })
                }
            },
            created() {
                var token = localStorage.getItem("token")
                    if (!token) {
                        location.href = "login.html?redirect=" + location.href
                    }
                this.attractionsId=wfx.urlToObj(decodeURI(location.href)).attractionsId;
                this.search()
            },
        })
    </script>


    <style>
        .insurancePopupBackground {
            display: none;
            /* Hidden by default */
            position: fixed;
            /* Stay in place */
            z-index: 22;
            /* Sit on top 保险的菜单不知道被谁设置成了21 */
            left: 0;
            top: 0;
            width: 100%;
            /* Full width */
            height: 100%;
            /* Full height */
            overflow: auto;
            /* Enable scroll if needed */
            background-color: rgb(0, 0, 0);
            /* Fallback color */
            background-color: rgba(0, 0, 0, 0.4);
            /* Black w/ opacity */
            padding-top: 60px;
        }

        .insurancePopup {
            z-index: 23;
            background-color: #F5F5F5;
            margin: 5% auto 15% auto;
            /* 5% from the top, 15% from the bottom and centered */
            border: 1px solid #888;
            width: 680px;
            border-radius: 25px;
            background-image: url("/scenic_front/img/background.png");
            background-repeat: no-repeat;
        }

        .insuranceTitle {
            z-index: 25;
            text-align: center;
            margin-top: 10%;
        }

        .promotion {
            font-size: 24px;
            color: white;
        }

        .insuranceType {
            font-size: 18px;
            border: 1px;
            border-radius: 15px;
            background-color: white;
            width: fit-content;
            color: blue;
            height: fit-content;
            margin-left: auto;
            margin-right: auto;
            margin-top: 5%;
            padding-left: 3%;
            padding-right: 3%;
            padding-top: 1%;
            padding-bottom: 1%;
        }

        .insuranceDetails {
            z-index: 25;
            background-color: #fefefe;
            margin: 5% auto 5% auto;
            border-radius: 15px;
            width: 85%;
            /* Could be more or less, depending on screen size */
        }

        .insuranceNameAndPrice {
            margin-left: 5%;
            margin-right: 5%;
            font-size: 18px;
            display: grid;
            grid-template-columns: auto auto 24px;
        }



        .description {
            z-index: 25;
            color: #888888;
            margin-left: 5%;
            padding-bottom: 2%;
        }

        .insuranceInfoConfirm {
            background-color: #FF8800;
            width: 25%;
            border-radius: 5px;
            font-size: 20px;
            color: white;
            display: block;
            margin-left: auto;
            margin-right: auto;
            padding-top: 1%;
            padding-bottom: 1%;
        }
    </style>

    <!-- footer\ -->
    <div class="wrap" style="clear: both;"><a class="public_ft" href="http://www.lvmama.com/public/user_security"
            target="_blank">
            <ul class="public_ft_list">
                <li><i class="ft_ioc1"></i><strong>价格保证</strong>同类产品，保证低价</li>
                <li><i class="ft_ioc2"></i><strong>退订保障</strong>因特殊情况影响出行，保证退订</li>
                <li><i class="ft_ioc3"></i><strong>救援保障</strong>旅途中遇意外情况，保证援助</li>
                <li><i class="ft_ioc4"></i><strong>7x24小时服务</strong>快速响应，全年无休</li>
            </ul>
        </a></div><!-- copyright\ -->
    <div class="lv-footer clearfix wrap" style="margin:0 auto;">
        <p class="footer-link"> <a href="http://www.lvmama.com/public/about_lvmama" rel="nofollow">关于我们</a> | <a
                href="http://www.lvmama.com/public/lianxi_us" rel="nofollow">联系我们</a> | <a
                href="http://www.lvmama.com/public/site_map">网站地图</a> | <a
                href="http://hotels.lvmama.com/brand/">酒店品牌</a> | <a href="http://hotels.lvmama.com/area/">酒店查询</a> | <a
                href="http://www.lvmama.com/public/help" rel="nofollow">帮助中心</a> | <a
                href="http://www.lvmama.com/public/links">友情链接</a> | <a href="http://www.lvmama.com/public/jobs"
                rel="nofollow">诚聘英才</a> | <a href="http://www.lvmama.com/public/zizhi_lvmama" rel="nofollow">旅游度假资质</a>
            | <a href="http://www.lvmama.com/userCenter/user/transItfeedBack.do" rel="nofollow">意见反馈</a> | <a
                rel="nofollow" href="http://www.lvmama.com/public/adwy">广告业务</a> </p>
        <p class="lv-copyright">Copyright © 2020 www.lvmama.com. 上海景域文化传播股份有限公司版权所有　<a
                href="http://pic.lvmama.com/img/businesslicense.jpg" target="_blank">营业执照</a>　<a
                href="http://www.beian.miit.gov.cn/" target="_blank"
                rel="nofollow">沪ICP备13011172号-3</a>　增值电信业务经营许可证编号：<a rel="nofollow"
                href="http://pic.lvmama.com/img/ICP.jpg" target="_blank">沪B2-20100030</a></p>
        <div class="lv-safety"> <a class="safety2" target="_blank" rel="nofollow" title="经营性网站备案信息"
                href="http://www.beian.miit.gov.cn/"></a> <a class="safety3" target="_blank" rel="nofollow"
                title="网络110报警服务" href="http://www.cyberpolice.cn/"></a> <a class="safety4" target="_blank"
                rel="nofollow" title="支付宝特约商家"></a> <a class="safety5" target="_blank" rel="nofollow" title="AAA级信用企业"
                href="http://www.itrust.org.cn/home/index/itrust_certifi/wm/1664396140.html"></a> <a class="safety6"
                target="_blank" rel="nofollow" title="上海工商"
                href="http://scjgj.sh.gov.cn/lz/licenseLink.do?method=licenceView&amp;entyId=20110930103539539"></a> <a
                class="safety7" target="_blank" rel="nofollow" title="可信网站"
                href="https://ss.knet.cn/verifyseal.dll?sn=2010101800100002662&amp;comefrom=trust&amp;trustKey=dn&amp;trustValue=www.lvmama.com"></a>
            <a class="safety8" target="_blank" rel="nofollow" title="诚信认证示范企业"
                href="https://credit.szfw.org/CX20160614015657160455.html" id="___szfw_logo___" hidefocus="false"></a>
            <a class="safety9" target="_blank" rel="nofollow" title="网络社会征信网" href="http://www.zx110.org/"></a> <a
                class="safety10" target="_blank" rel="nofollow" title="360网站安全检测" href="http://webscan.360.cn/"></a> <a
                class="safety11" target="_blank" rel="nofollow" title="网监安全"
                href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=31011402005637"></a> <a
                class="safety13" target="_blank" rel="nofollow" title="举报中心" href="http://www.shjbzx.cn/"></a> </div>
    </div><!-- //footer -->
   
    <div class="poptip tip-light poptip-default" style="display: none;" id="poptip1">
        <div class="tip-arrow tip-arrow-12"> <em>◆</em> <i>◆</i> </div>
        <div class="tip-content">
            <h5 class="tip-title"></h5>
            <p></p>
        </div>
    </div>
    <div id="text_big"
        style="height:36px; line-height:36px; padding:0 10px; background:#FFFDE6;  border:#FFAA00 solid 1px; position:absolute; color:#333; font-family:Arial; font-size:20px; display:none;">
    </div>
    <div style="visibility: hidden; position: absolute;" id="userdata_el"></div>
</body>

</html>